<template>
  <div id="app">
    <a-button v-if="$route.name !== 'login'" class="dashboard_create_button" icon="plus" @click="toRoute">New Ideation</a-button>

    <router-view :key="$route.query.key"/>

    <div class="side_other" v-if="$route.name !== 'login'">
<!--      <div class="side_other_item">-->
<!--        <a-icon :component="info" />-->
<!--        <span style="margin-left: 10px">What’s new?</span>-->
<!--      </div>-->
      <div class="side_other_item" @click="toRouteHome">
        <img style="width: 12px;height: 12px" src="~@/assets/logo.png" class="logo" alt="logo">
          <span style="margin-left: 10px" @click="toHome">Go to homepage</span>
      </div>
      <div class="side_other_tips">
        Made with <a-icon :component="xin" /> by Ideaio
      </div>
    </div>
  </div>
</template>

<script>
import { domTitle, setDocumentTitle } from '@/utils/domUtil'
import { i18nRender } from '@/locales'
import info from './assets/icons/info.svg?inline'
import xin from './assets/icons/xin.svg?inline'
export default {
  data () {
    return {
      info: info,
      xin: xin
    }
  },
  computed: {
    locale () {
      // 只是为了切换语言时，更新标题
      const { title } = this.$route.meta
      title && (setDocumentTitle(`${i18nRender(title)} - ${domTitle}`))

      return this.$i18n.getLocaleMessage(this.$store.getters.lang).antLocale
    }
  },
  methods: {
      toHome() {
          location.href = 'https://www.ideaio.xyz/'
      },
    toRoute () {
      this.$router.push({
        path: '/Dashboard/create?key=' + new Date().getTime()
      })
    },
    toRouteHome () {
      this.$router.push({
        path: '/Dashboard'
      })
    }
  }
}
</script>
<style lang="less">
.side_other {
  position: fixed;
  left: 0;
  bottom: 0;
  width: 256px;
  z-index: 999;
  color: #FFFFFF;
  .side_other_item {
    font-size: 16px;
    padding: 20px 14px;
    border-bottom: 1px solid #FFFFFF;
    cursor: pointer;
    transition: color 0.3s;
    &:hover {
      color: #069697;
    }
  }
  .side_other_tips {
    font-size: 16px;
    padding: 30px 20px 30px 10px;
    text-align: center;
    font-family: Quicksand700, serif;
  }
}
</style>
